<!DOCTYPE html>
<html>
<head lang="en">
    <base href="${request.contextPath}/"/>
    <meta charset="UTF-8">
    <#import "/spring.ftl" as spring>
    <title><@spring.message code="login.tip"/></title>
    <link rel="shortcut icon" href="${request.contextPath}/favicon.ico" type="image/x-icon" />
    <link href="${request.contextPath}/zhny/css/reset.css" rel="stylesheet" type="text/css">
    <link href="${request.contextPath}/zhny/css/index.css" rel="stylesheet" type="text/css">

    <script type="text/javascript" src="${request.contextPath}/zhny/js/echarts.js"></script>
    <script type="text/javascript" src="${request.contextPath}/zhny/js/js(省份)/heilongjiang.js"></script>
    <script type="text/javascript" src="${request.contextPath}/zhny/js/bmap.js"></script>


    <script src="${request.contextPath}/zhny/js/jquery.min.js"></script>
    <!--字体缩放js-->
    <script src="${request.contextPath}/zhny/js/js-style.js"></script>
    <!--end字体缩放js-->
    <!--动态特效-->
    <link href="${request.contextPath}/zhny/css/style.css" rel="stylesheet" type="text/css" />
    <!--隐藏导航js-->


</head>
<body >


<!--top-->

<header class="header">
    <div class="header_box clearfix">
        <div class="header_box_l">
            <p>hello,${user.username!""}，<@spring.message code="index.wel"/></p>
        </div>
        <div class="header_box_c">
                <div class="masked">
                    <@spring.message code="login.tip"/>
                </div>
        </div>
        <div class="header_box_r ">
            <a href="${request.contextPath}/sy/index/indexnew?locale=zh_CN" target="_self">中文版</a>
            <a href="${request.contextPath}/sy/index/indexnew?locale=en_US" target="_self">English</a>
            <a href="${request.contextPath}/sy/logout" target="_self"><@spring.message code="index.out"/></a>
        </div>
    </div>
</header>
<!--end top-->

<div class="comment clearfix">
    <!--排行-->
    <div class="paiHang" >
        <div class="paiHang_box">
            <div class="paiHang_box_01 clearfix">
                <h3 style="font-size: 0.24rem">NO. 1</h3>
                <p  class="p1" style="font-size: 0.18rem">哈尔滨</p>
                <p  class="p2" style="font-size: 0.18rem">1256w</p>
            </div>
            <div class="paiHang_box_01 clearfix">
                <h3 style="font-size: 0.24rem">NO. 2</h3>
                <p  class="p1" style="font-size: 0.18rem">佳木斯</p>
                <p  class="p2" style="font-size: 0.18rem">1256w</p>
            </div>
            <div class="paiHang_box_01 clearfix">
                <h3 style="font-size: 0.24rem">NO. 3</h3>
                <p  class="p1" style="font-size: 0.18rem">鹤岗</p>
                <p  class="p2" style="font-size: 0.18rem">1256w</p>
            </div>
            <div class="paiHang_box_01 clearfix">
                <h3 style="font-size: 0.24rem">NO. 4</h3>
                <p  class="p1" style="font-size: 0.18rem">伊春</p>
                <p  class="p2" style="font-size: 0.18rem">1256w</p>
            </div>
            <div class="paiHang_box_01 clearfix">
                <h3 style="font-size: 0.24rem">NO. 5</h3>
                <p  class="p1" style="font-size: 0.18rem">伊春</p>
                <p  class="p2" style="font-size: 0.18rem">1256w</p>
            </div>
            <div class="paiHang_box_01 clearfix">
                <h3 style="font-size: 0.24rem">NO. 6</h3>
                <p  class="p1" style="font-size: 0.18rem">伊春</p>
                <p  class="p2" style="font-size: 0.18rem">1256w</p>
            </div>

           <div class="dong_img">
                <img src="${request.contextPath}/zhny/images/6.gif">
            </div>


        </div>


    </div>
    <!--end排行-->
    <!--地图-->
    <div class="map_heiLongJiang">
        <div id="main8" style="width: 100%;height: 120%;">
            <script type="text/javascript">
                /*-&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;main-&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;*/
                var myChart8 = echarts.init(document.getElementById('main8'));
                // 指定图表的配置项和数据

                var uploadedDataURL = "${request.contextPath}/zhny/js/json(省份)/heilongjiang.json";/*此处要用json文件地址*/
                myChart8.showLoading();
                $.getJSON(uploadedDataURL, function(geoJson) {
                    echarts.registerMap('heilongjiang', geoJson);
                    myChart8.hideLoading();
                    var geoCoordMap = {
                        '<@spring.message code="map.Harbin"/>':[126.6833333,45.75],
                        '<@spring.message code="map.Qiqihar"/>':[123.97,47.33],
                        '<@spring.message code="map.Yichun"/>':[128.845347,47.734966],
                        '<@spring.message code="map.Sunwu"/>':[127.339643,49.432745],
                        '<@spring.message code="map.ShuangyashanRegion"/>':[131.162095,46.65486],
                        '<@spring.message code="map.NeheCounty"/>':[124.887287,48.491721],
                        '<@spring.message code="map.AndaRegion"/>':[125.343168,46.427421],
                        '<@spring.message code="map.ZhaoyuanCounty"/>':[125.081312,45.525869],
                        '<@spring.message code="map.Jixi"/>':[130.972319,45.302619],
                        '<@spring.message code="map.Qitaihe"/>':[131.009356,45.777682],
                        '<@spring.message code="map.Raohe"/>':[134.018284,46.805523],
                        '<@spring.message code="map.FujinCounty"/>':[132.041806,47.257597],
                        '<@spring.message code="map.Luobei"/>':[130.83336,47.585073],
                        '<@spring.message code="map.Suibin"/>':[131.857339,47.296609],
                        '<@spring.message code="map.Daqing"/>':[125.106671,46.594992],
                        '<@spring.message code="map.HumaRegion"/>':[126.65, 51.73],
                        '<@spring.message code="map.XunkeCounty"/>':[128.47, 49.58],
                        '<@spring.message code="map.Daxinganling"/>':[123.90, 52.22],

                    }
                    var data = [
                        {name: '<@spring.message code="map.Harbin"/>', value: 180},
                        {name: '<@spring.message code="map.Qiqihar"/>', value: 150},
                        // {name: '鹤岗', value: 150},
                        {name: '<@spring.message code="map.Yichun"/>', value: 150},
                        {name: '<@spring.message code="map.Sunwu"/>', value: 160},
                        {name: '<@spring.message code="map.ShuangyashanRegion"/>', value: 160},
                        {name: '<@spring.message code="map.NeheCounty"/>', value: 160},
                        {name: '<@spring.message code="map.AndaRegion"/>', value: 160},
                        {name: '<@spring.message code="map.ZhaoyuanCounty"/>', value: 150},
                        {name: '<@spring.message code="map.Jixi"/>', value: 150},
                        {name: '<@spring.message code="map.Qitaihe"/>', value: 160},
                        {name: '<@spring.message code="map.Raohe"/>', value: 160},
                        {name: '<@spring.message code="map.FujinCounty"/>', value: 160},
                        {name: '<@spring.message code="map.Luobei"/>', value: 160},
                        {name: '<@spring.message code="map.Suibin"/>', value: 160},
                        {name: '<@spring.message code="map.Daqing"/>', value: 150},
                        {name: '<@spring.message code="map.HumaRegion"/>', value: 160},
                        {name: '<@spring.message code="map.XunkeCounty"/>', value: 160},
                        {name: '<@spring.message code="map.Daxinganling"/>', value: 150},

                    ];
/*
                    var data = [
                        {name: '哈尔滨', value: 180},
                        {name: '齐齐哈尔', value: 150},
                        // {name: '鹤岗', value: 150},
                        {name: '伊春', value: 150},
                        {name: '孙吴', value: 160},
                        {name: '双鸭山', value: 160},
                        {name: '讷河县', value: 160},
                        {name: '安达地区', value: 160},
                        {name: '肇源', value: 150},
                        {name: '鸡西', value: 150},
                        {name: '七台河', value: 160},
                        {name: '饶河', value: 160},
                        {name: '富锦县', value: 160},
                        {name: '萝北', value: 160},
                        {name: '绥滨', value: 160},
                        {name: '大庆', value: 150},
                        {name: '呼玛地区', value: 160},
                        {name: '逊克县', value: 160},
                        {name: '大兴安岭', value: 150},

                    ];*/


                    var convertData = function (data) {
                        var res = [];
                        for (var i = 0; i < data.length; i++) {
                            var geoCoord = geoCoordMap[data[i].name];
                            if (geoCoord) {
                                res.push({
                                    name: data[i].name,
                                    value: geoCoord.concat(data[i].value)
                                });
                            }
                        }
                        return res;
                    };


                    option = {


                        tooltip: {
                            trigger: 'item',
                            formatter: function (params) {
                                if(typeof(params.value)[2] == "undefined"){
                                    //return params.name + ' : ' + params.value;
                                    return params.name ;
                                }else{
                                   // return params.name + ' : ' + params.value[2];
                                    return params.name ;
                                }
                            }
                        },
                        /*   legend: {
                         orient: 'vertical',
                         y: 'bottom',
                         x: 'right',
                         data:['pm2.5'],
                         textStyle: {
                         color: '#fff'
                         }
                         },*/

                        legend: {
                            orient: 'vertical',
                            y: 'bottom',
                            x:'right',
                            data:['pm2.5'],
                            textStyle: {
                                color: '#fff'
                            }
                        },

                        visualMap: {
                            show: false,
                            min: 0,
                            max: 500,
                            left: 'left',
                            top: 'bottom',
                            text: ['高', '低'], // 文本，默认为数值文本
                            calculable: true,
                            seriesIndex: [1],
                            inRange: {
                                // color: ['#3B5077', '#031525'] // 蓝黑
                                // color: ['#ffc0cb', '#800080'] // 红紫
                                // color: ['#3C3B3F', '#605C3C'] // 黑绿
                                //color: ['#0f0c29', '#302b63', '#24243e'] // 黑紫黑
                                //color: ['#23074d', '#cc5333'] // 紫红
                                // color: ['#00467F', '#A5CC82'] // 蓝绿
                                // color: ['#1488CC', '#2B32B2'] // 浅蓝
                                // color: ['#00467F', '#A5CC82'] // 蓝绿
                                // color: ['#00467F', '#A5CC82'] // 蓝绿
                                // color: ['#00467F', '#A5CC82'] // 蓝绿
                                // color: ['#00467F', '#A5CC82'] // 蓝绿

                            }
                        },


                        geo: {
                            show: true,
                            default: 0.5,
                            map: 'heilongjiang',
                            label: {
                                normal: {
                                    show: false
                                },
                                emphasis: {
                                    show: false,
                                }
                            },
                            roam: 'false',   // 如果只想要开启缩放或者平移，可以设置成 'scale' 或者 'move'。设置成 true 为都开启
                            itemStyle: {
                                normal: {
                                    areaColor: 'transparent',
                                    borderColor: '#3fdaff',
                                    borderWidth: 2,
                                    shadowColor: 'rgba(63, 218, 255, 0.5)',
                                    shadowBlur: 30
                                },
                                emphasis: {
                                    areaColor: '#2B91B7',
                                }
                            }
                        },
                        series : [
                            {
                                type: 'map',
                                mapType: name,
                                selectedMode: 'single',//单选地图
                                roam: false,//禁止缩放

                                name: 'light',
                                type: 'scatter',
                                coordinateSystem: 'geo',
                                data: convertData(data),
                                symbolSize: function (val) {
                                    return val[2] / 10;
                                },
                                label: {
                                    normal: {
                                        formatter: '{b}',
                                        position: 'right',
                                        show: true
                                    },
                                    emphasis: {
                                        show: true
                                    }
                                },
                                itemStyle: {
                                    normal: {
                                        color: '#F4E925'
                                    }
                                }
                            },

                            {
                                type: 'map',
                                map: 'heilongjiang',
                                geoIndex: 0,
                                aspectScale: 0.75, //长宽比
                                showLegendSymbol: false, // 存在legend时显示
                                label: {
                                    normal: {
                                        show: false
                                    },
                                    emphasis: {
                                        show: false,
                                        textStyle: {
                                            color: '#fff'
                                        }
                                    }
                                },
                                roam: true,
                                itemStyle: {
                                    normal: {
                                        areaColor: '#031525',
                                        borderColor: '#FFFFFF',
                                    },
                                    emphasis: {
                                        areaColor: '#2B91B7'
                                    }
                                },
                                animation: false,
                                data: data
                            },
                            {
                                name: 'Top 5',
                                type: 'effectScatter',
                                coordinateSystem: 'geo',
                                data: convertData(data.sort(function (a, b) {
                                    return b.value - a.value;
                                }).slice(0, 12)),
                                symbolSize: function (val) {
                                    return val[2] / 10;
                                },
                                showEffectOn: 'render',
                                rippleEffect: {
                                    brushType: 'stroke'
                                },
                                hoverAnimation: true,
                                label: {
                                    normal: {
                                        formatter: '{b}',
                                        position: 'right',
                                        show: true
                                    }
                                },
                                itemStyle: {
                                    normal: {
                                        color: '#F4E925',
                                        shadowBlur: 10,
                                        shadowColor: '#05C3F9'
                                    }
                                },
                                zlevel: 1
                            },

                        ]
                    };
                    myChart8.setOption(option);
                    myChart8.on('click', function (params) {
                        var city = params.name;
                        //console.log(params.name);
                        if (params.name == '<@spring.message code="map.Luobei"/>') {
                            nydsj("luobei");
                        }
                        if (params.name == '<@spring.message code="map.Qitaihe"/>') {
                            nydsj("qitaihe");
                        }
                        if (params.name == '<@spring.message code="map.Suibin"/>') {
                            nydsj("suibin");
                        }
                        if (params.name == '<@spring.message code="map.Sunwu"/>') {
                            nydsj("sunwu");
                        }
                        if (params.name == '<@spring.message code="map.Raohe"/>') {
                            nydsj("raohe");
                        }
                        if (params.name == '<@spring.message code="map.XunkeCounty"/>') {
                            // $(function () {
                            //     setTimeout(function () {
                            //         alert("网络异常，请联系管理员！！！");
                            //     }, 2000);
                            // })
                            nydsj("xunke");
                        }
                        if (params.name == '<@spring.message code="map.HumaRegion"/>') {
                            // $(function () {
                            //     setTimeout(function () {
                            //         alert("网络异常，请联系管理员！！！");
                            //     }, 2000);
                            // })
                            parent.nydsj("huma");
                        }

                        if (params.name == '<@spring.message code="map.NeheCounty"/>') {
                            nydsj("nehe");
                        }
                        if (params.name == '<@spring.message code="map.ShuangyashanRegion"/>') {

                        }
                        if (params.name == '<@spring.message code="map.AndaRegion"/>') {
                            nydsj("anda");
                        }
                        if (params.name == '<@spring.message code="map.FujinCounty"/>') {
                            nydsj("fujin");
                        }
                     });
                });





            </script>
        </div>
    </div>
    <!--end地图-->
    <!--右侧4块-->
    <div class="four_box ">
        <!--1-->
        <div class="four_box_01" style="margin-bottom: 2%">
            <div class="four_box_01_title clearfix">
                <div class="title_l">
                    <!--<h4>种植面积</h4>
                    <span>planting area</span>-->
                    <h4>品种覆盖</h4>
                    <span>Variety Coverage</span>
                </div>
                <div class="title_r">
                   <p>/&nbsp;01</p>
                 </div>
            </div>
            <div class="line"></div>
            <div class="bj_box_content"  >
                <div class="up">
                    <div id="main1" style="width: 100%;height: 100%">
                        <script type="text/javascript">
                            var aa = [];
                            var bb = [];
                            $(function () {
                                $.ajax({
                                    url:"${request.contextPath}/sy/index/plantType",
                                    dataType:"json",
                                    type:"post",
                                    success:function (json) {
                                        $.each(json,function (i, v) {
                                            /*alert(item.type);*/
                                            bb.push(v.type);
                                            var obj = new Object();
                                            obj.month = v.type;
                                            obj.value = v.value;
                                            obj.ratio = v.percent;
                                            aa.push(obj);
                                        });
                                        /*alert(aa);*/
                                        console.log(aa);

                                        /*alert(name);
                                        console.log(name);*/
                             /*-----------------------------main-----------------------------*/
                             var myChart1 = echarts.init(document.getElementById('main1'));
                            // 指定图表的配置项和数据
                            let data = {
                                "chart": aa
                                /*[{
                                    /!*month: "5月",
                                    value: 138,
                                    ratio: 14.89*!/
                                    month: type[0],
                                    value: value[0],
                                    ratio: percent[0]
                                },

                                    {
                                        month: type[1],
                                        value: value[1],
                                        ratio: percent[1]
                                    },

                                    {
                                        month: type[2],
                                        value: value[2],
                                        ratio: percent[2]
                                    },

                                    {
                                        month: type[3],
                                        value: value[3],
                                        ratio: percent[3]
                                    },

                                    {
                                        month: "9月",
                                        value: 622,
                                        ratio: 44.5
                                    },


                                    {
                                        month: "10月",
                                        value: 528,
                                        ratio: 87.3
                                    }

                                ]*/
                            }

                            //  x轴数据          象形柱图数据  折线图数据
                            let xAxisMonth = [],
                                    barData = [],
                                    lineData = [];
                            for (let i = 0; i < data.chart.length; i++) {
                                xAxisMonth.push(data.chart[i].month);
                                barData.push({
                                    "name": xAxisMonth[i],
                                    "value": data.chart[i].value
                                });
                                lineData.push({
                                    "name": xAxisMonth[i],
                                    "value": data.chart[i].ratio
                                });
                            }

                            option = {

                                title: '',
                                grid: {
                                    top: '10%',
                                    left: '2%',
                                    bottom: '2%',
                                    containLabel: true
                                },
                                tooltip: {
                                    trigger: 'axis',
                                    axisPointer: {
                                        type: 'none'
                                    },
                                    formatter: function(params) {
                                        return params[0]["data"].name + "<br/>" + '品种: ' + params[1]["data"].value + "<br/>" + '占比(%): ' + params[0]["data"].value;
                                    }
                                },
                                xAxis: [{
                                    type: 'category',
                                    show: false,
                                    /*data: ['3月', '4月', '5月', '6月', '7月', '8月'],*/
                                    data:bb,
                                    axisLabel: {
                                        textStyle: {
                                            color: '#b6b5ab'
                                        }
                                    }
                                },
                                    {
                                        type: 'category',
                                        position: "bottom",
                                        data: xAxisMonth,
                                        boundaryGap: true,
                                        // offset: 40,
                                        axisTick: {
                                            show: false
                                        },
                                        axisLine: {
                                            show: false
                                        },
                                        axisLabel: {
                                            textStyle: {
                                                color: '#b6b5ab'
                                            }
                                        }
                                    }

                                ],
                                yAxis: [{
                                    show: true,
                                    offset: 52,
                                    splitLine: {
                                        show: false,
                                        lineStyle: {
                                            color: "rgba(255,255,255,0.2)"
                                        }
                                    },
                                    axisTick: {
                                        show: false
                                    },
                                    axisLine: {
                                        show: true
                                    },
                                    axisLabel: {
                                        show: true,
                                        color: '#b6b5ab'
                                    }
                                }, {
                                    show: false,
                                    type: "value",
                                    name: "合格率(%)",
                                    nameTextStyle: {
                                        color: '#ccc'
                                    },
                                    axisLabel: {
                                        color: '#ccc'
                                    },
                                    splitLine: {
                                        show: false
                                    },
                                    axisLine: {
                                        show: false
                                    },
                                    axisTick: {
                                        show: false
                                    }
                                }],
                                color: ['#e54035'],
                                series: [{
                                    name: '参训人次',
                                    type: 'pictorialBar',
                                    xAxisIndex: 1,
                                    barCategoryGap: '-80%',
                                    // barCategoryGap: '-5%',
                                    symbol: 'path://d="M150 50 L130 130 L170 130  Z"',
                                    itemStyle: {
                                        normal: {
                                            color: function(params) {
                                                let colorList = [
                                                    'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)',
                                                    'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)',
                                                    'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)'
                                                ];
                                                return colorList[params.dataIndex];
                                            }
                                        },
                                        emphasis: {
                                            opacity: 1
                                        }
                                    },
                                    data: barData,
                                },
                                    {
                                        symbol: 'image://',
                                        symbolSize: 42,
                                        name: "完成率",
                                        type: "line",
                                        yAxisIndex: 1,
                                        data: lineData,
                                        itemStyle: {
                                            normal: {
                                                borderWidth: 5,
                                                color: {
                                                    colorStops: [{
                                                        offset: 0,
                                                        color: '#821eff'
                                                    },

                                                        {
                                                            offset: 1,
                                                            color: '#204fff'
                                                        }
                                                    ],
                                                }
                                            }
                                        }
                                    }
                                ]
                            }


                            myChart1.setOption(option);
                                    }

                                });
                            });
                        </script>
                    </div>
                </div>
<!--                <div class="down">-->
<!--                    <h5>黑龙江总种植面积,同比增幅</h5>-->
<!--                    <strong>1234<span>万</span></strong><p><i>+</i> 20%</p>-->
<!--                </div>-->
            </div>
        </div>
        <!--2-->
        <div class="four_box_01" style="margin-bottom: 2%">
            <div class="four_box_01_title clearfix">
                <div class="title_l">
                    <!--<h4>粮食产量</h4>
                    <span>Food production</span>-->
                    <!--<h4>种植面积增速</h4>
                    <span>Growth rate of planting area</span>-->
                    <h4>种植面积</h4>
                    <span>planting area</span>
                </div>
                <div class="title_r">
                    <p>/&nbsp;02</p>
                </div>
            </div>
            <div class="line"></div>
            <div class="bj_box_content"  >
                <div class="up">
                    <div id="main2" style="width: 100%;height: 90%">
                        <script type="text/javascript">

                            // 指定图表的配置项和数据
                            var cc = [];
                            var dd = [];
                            $(function () {
                                $.ajax({
                                    url:"${request.contextPath}/sy/index/plantArea",
                                    dataType:"json",
                                    type:"post",
                                    success:function (obj) {
                                        $.each(obj,function (index,item) {
                                            /*alert(item.years);*/
                                            cc.push(item.type);
                                            dd.push(item.value);
                                        });
                                        /*alert(cc);
                                        alert(dd);*/
                                        /*alert(str2015);*/
                            /*var xData = ['2015','2016','2017','2018','2019'];*/
                            var yData = dd;
                            var xData = cc;
                            /*var yData = [str2015,str2016,str2017,str2018,str2019];*/
                            /*-----------------------------main-----------------------------*/
                            var myChart2= echarts.init(document.getElementById('main2'));
                            option = {

                                color: ['#3398DB'],
                                tooltip: {
                                    trigger: 'axis',
                                    axisPointer: {
                                        type: 'line',
                                        lineStyle: {
                                            opacity: 0
                                        }
                                    },
                                    formatter: function(prams) {
                                        return "办理数：" + prams[0].data
                                    }
                                },
                                grid: {
                                    left: '2%',
                                    right: '2%',
                                    bottom: '0%',
                                    top: '7%',

                                    containLabel: true,
                                    z: 22
                                },
                                xAxis: [{
                                    type: 'category',
                                    gridIndex: 0,
                                    data: xData,
                                    axisTick: {
                                        alignWithLabel: true
                                    },
                                    axisLine: {
                                        lineStyle: {
                                            color: '#0c3b71'
                                        }
                                    },
                                    axisLabel: {
                                        show: true,
                                        color: 'rgb(170,170,170)',
                                        fontSize: 12
                                    }
                                }],
                                yAxis: [{
                                    type: 'value',
                                    gridIndex: 0,
                                    splitLine: {
                                        show: false
                                    },
                                    axisTick: {
                                        show: false
                                    },
                                    axisLine: {
                                        lineStyle: {
                                            color: '#0c3b71'
                                        }
                                    },
                                    axisLabel: {
                                        color: 'rgb(170,170,170)',
                                        formatter: '{value}'
                                    }
                                },
                                    {
                                        type: 'value',
                                        gridIndex: 0,
                                        splitNumber: 12,
                                        splitLine: {
                                            show: false
                                        },
                                        axisLine: {
                                            show: false
                                        },
                                        axisTick: {
                                            show: false
                                        },
                                        axisLabel: {
                                            show: false
                                        },
                                        splitArea: {
                                            show: true,
                                            areaStyle: {
                                                color: ['rgba(250,250,250,0.0)', 'rgba(250,250,250,0.05)']
                                            }
                                        }
                                    }
                                ],
                                series: [{
                                    name: '办理数',
                                    type: 'bar',
                                    barWidth: '30%',
                                    xAxisIndex: 0,
                                    yAxisIndex: 0,
                                    label: {
                                        normal: {
                                            show: true,
                                            position: "top",
                                            textStyle: {
                                                color: "#ffc72b",
                                                fontSize: 12
                                            }
                                        }
                                    },
                                    itemStyle: {
                                        normal: {
                                            color: new echarts.graphic.LinearGradient(
                                                    0, 0, 0, 1, [{
                                                        offset: 0,
                                                        color: '#00feff'
                                                    },
                                                        {
                                                            offset: 0.5,
                                                            color: '#027eff'
                                                        },
                                                        {
                                                            offset: 1,
                                                            color: '#0286ff'
                                                        }
                                                    ]
                                            )
                                        }
                                    },
                                    data: yData,
                                    zlevel: 11

                                },
                                    {
                                        name: '背景',
                                        type: 'bar',
                                        barWidth: '50%',
                                        xAxisIndex: 0,
                                        yAxisIndex: 1,
                                        barGap: '-135%',
                                        data: [100, 100, 100, 100, 100, 100, 100],
                                        itemStyle: {
                                            normal: {
                                                color: 'rgba(255,255,255,0.1)'
                                            }
                                        },
                                        zlevel: 9
                                    },

                                ]
                            };






                            myChart2.setOption(option);
                                    }

                                });
                            });
                        </script>
                    </div>
                </div>
<!--                <div class="down">-->
<!--                    <h5>黑龙江总种植面积,同比增幅</h5>-->
<!--                    <strong>1234<span>万</span></strong><p><i>+</i> 20%</p>-->
<!--                </div>-->
            </div>
        </div>
        <!--3-->
        <div class="four_box_01" >
            <div class="four_box_01_title clearfix">
                <div class="title_l">
                    <h4>种植面积增速</h4>
                    <span>Growth rate of planting area</span>
                </div>
                <div class="title_r">
                    <p>/&nbsp;03</p>
                </div>
            </div>
            <div class="line"></div>
            <div class="bj_box_content"  >
                <div class="up">
                    <div id="main3" style="width: 100%;height: 100%">
                        <script type="text/javascript">
                            /*-----------------------------main-----------------------------*/
                            var myChart3= echarts.init(document.getElementById('main3'));
                            // 指定图表的配置项和数据

                            option = {
                                title: {
                                    textStyle: {
                                        fontWeight: 'normal',
                                        fontSize: 19,
                                        color: '#aaa'
                                    },
                                    left: '6%'
                                },

                                legend: {
                                    icon: 'rect',
                                    itemWidth: 14,
                                    itemHeight: 5,
                                    itemGap: 13,
                                    data: ['马铃薯', '大豆','玉米', '水稻'],
                                    right: '4%',
                                    textStyle: {
                                        fontSize: 12,
                                        color: '#aaa'
                                    }
                                },
                                grid: {
                                    left: '3%',
                                    right: '4%',
                                    bottom: '3%',
                                    containLabel: true
                                },
                                xAxis: [{
                                    type: 'category',
                                    boundaryGap: false,
                                    axisLine: {
                                        lineStyle: {
                                            color: '#136cc6'
                                        }
                                    },
                                    data: ['2016', '2017', '2018']
                                }],
                                yAxis: [{
                                    type: 'value',
                                    name: '单位（%）',
                                    axisTick: {
                                        show: false
                                    },
                                    axisLine: {
                                        lineStyle: {
                                            color: '#136cc6'
                                        },

                                    },
                                    axisLabel: {
                                        margin: 10,
                                        textStyle: {
                                            fontSize: 14
                                        }
                                    },
                                    splitLine: {
                                        lineStyle: {
                                            color: '#57617B'
                                        }
                                    }
                                }],
                                series: [{
                                    name: '马铃薯',
                                    type: 'line',
                                    smooth: true,
                                    symbol: 'circle',
                                    symbolSize: 5,
                                    showSymbol: false,
                                    lineStyle: {
                                        normal: {
                                            width: 3
                                        }
                                    },
                                    areaStyle: {
                                        normal: {
                                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                                offset: 0,
                                                color: 'rgba(16,97,204, 0.3)'
                                            }, {
                                                offset: 0.8,
                                                color: 'rgba(17,235,210, 0)'
                                            }], false),
                                            shadowColor: 'rgba(0, 0, 0, 0.1)',
                                            shadowBlur: 10
                                        }
                                    },
                                    itemStyle: {
                                        normal: {

                                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                                offset: 0,
                                                color: 'rgba(16,97,204,1)'
                                            }, {
                                                offset: 1,
                                                color: 'rgba(17,235,210,1)'
                                            }])
                                        },
                                        emphasis: {
                                            color: 'rgb(0,196,132)',
                                            borderColor: 'rgba(0,196,132,0.2)',
                                            extraCssText: 'box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);',
                                            borderWidth: 10
                                        }
                                    },
                                    data: [0,1005,-49.58 ]
                                }, {
                                    name: '大豆',
                                    type: 'line',
                                    smooth: true,
                                    symbol: 'circle',
                                    symbolSize: 5,
                                    showSymbol: false,
                                    lineStyle: {
                                        normal: {
                                            width: 3
                                        }
                                    },
                                    areaStyle: {
                                        normal: {
                                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                                offset: 0,
                                                color: 'rgba(205,52,42, 0.5)'
                                            }, {
                                                offset: 0.8,
                                                color: 'rgba(235,235,21, 0)'
                                            }], false),
                                            shadowColor: 'rgba(0, 0, 0, 0.1)',
                                            shadowBlur: 10
                                        },
                                    },
                                    itemStyle: {
                                        normal: {

                                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                                offset: 0,
                                                color: 'rgba(205,52,42,1)'
                                            }, {
                                                offset: 1,
                                                color: 'rgba(235,235,21,1)'
                                            }])
                                        },
                                        emphasis: {
                                            color: 'rgb(99,250,235)',
                                            borderColor: 'rgba(99,250,235,0.2)',
                                            extraCssText: 'box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);',
                                            borderWidth: 10
                                        }
                                    },
                                    data: [0,434.55,-86.89]
                                }, {
                                    name: '玉米',
                                    type: 'line',
                                    smooth: true,
                                    symbol: 'circle',
                                    symbolSize: 5,
                                    showSymbol: false,
                                    lineStyle: {
                                        normal: {
                                            width: 3
                                        }
                                    },
                                    areaStyle: {
                                        normal: {
                                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                                offset: 0,
                                                color: 'rgba(0,255,28,0.5)'
                                            }, {
                                                offset: 0.8,
                                                color: 'rgba(0,255,43,0)'
                                            }], false),
                                            shadowColor: 'rgba(0, 0, 0, 0.1)',
                                            shadowBlur: 10
                                        },
                                    },
                                    itemStyle: {
                                        normal: {

                                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                                offset: 0,
                                                color: 'rgba(0,255,28,1)'
                                            }, {
                                                offset: 1,
                                                color: 'rgba(0,255,43,1)'
                                            }])
                                        },
                                        emphasis: {
                                            color: 'rgb(99,250,235)',
                                            borderColor: 'rgba(99,250,235,0.2)',
                                            extraCssText: 'box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);',
                                            borderWidth: 10
                                        }
                                    },
                                    data: [87.24,-0.65,550.53]
                                }, {
                                    name: '水稻',
                                    type: 'line',
                                    smooth: true,
                                    symbol: 'circle',
                                    symbolSize: 5,
                                    showSymbol: false,
                                    lineStyle: {
                                        normal: {
                                            width: 3
                                        }
                                    },
                                    areaStyle: {
                                        normal: {
                                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                                offset: 0,
                                                color: 'rgba(253,36,253, 0.5)'
                                            }, {
                                                offset: 0.8,
                                                color: 'rgba(255,0,188, 0)'
                                            }], false),
                                            shadowColor: 'rgba(0, 0, 0, 0.1)',
                                            shadowBlur: 10
                                        },
                                    },
                                    itemStyle: {
                                        normal: {

                                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                                offset: 0,
                                                color: 'rgba(253,36,253,1)'
                                            }, {
                                                offset: 1,
                                                color: 'rgba(255,0,188,1)'
                                            }])
                                        },
                                        emphasis: {
                                            color: 'rgb(99,250,235)',
                                            borderColor: 'rgba(99,250,235,0.2)',
                                            extraCssText: 'box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);',
                                            borderWidth: 10
                                        }
                                    },
                                    data: [9.65,-36.53,45.8]
                                }  ]
                            };




                            myChart3.setOption(option);

                        </script>
                    </div>
                </div>
                <div class="down">
                    <h5>黑龙江总种植面积,同比增幅</h5>
                    <strong>1234<span>万</span></strong><p><i>+</i> 20%</p>
                </div>
            </div>
        </div>
        <!--4-->
        <div class="four_box_01" >
            <div class="four_box_01_title clearfix">
                <div class="title_l">
                    <h4>粮食产量</h4>
                    <span>Food production</span>
                    <!--<h4>种植面积增速</h4>
                    <span>Growth rate of planting area</span>-->
                </div>
                <div class="title_r">
                    <p>/&nbsp;04</p>
                </div>
            </div>
            <div class="line"></div>
            <div class="bj_box_content"  >
                <div class="up">
                    <div id="main4" style="width: 100%;height: 100%">
                        <script type="text/javascript">
                            /*-----------------------------main-----------------------------*/
                            /*var myChart4= echarts.init(document.getElementById('main4'));*/
                            // 指定图表的配置项和数据
                            $(function () {
                                $.ajax({
                                    url:"${request.contextPath}/sy/index/GrainYield",
                                    dataType:"json",
                                    type:"post",
                                    success:function (obj) {
                                        var jsonarray= $.parseJSON(obj);
                                        var myChart4= echarts.init(document.getElementById('main4'));

                            var fontColor = '#30eee9';
                            option ={
                                grid: {
                                    left: '5%',
                                    right: '5%',
                                    top:'20%',
                                    bottom: '5%',
                                    containLabel: true
                                },
                                tooltip : {
                                    show: true,
                                    trigger: 'item'
                                },
                                legend: {
                                    show:true,
                                    x:'right',
                                    /*y:'35',*/
                                    y:'3',
                                    icon: 'stack',
                                    itemWidth:10,
                                    itemHeight:10,
                                    textStyle:{
                                        color:'#1bb4f6'
                                    },
                                    data:['马铃薯','大豆','玉米','水稻']
                                },
                                xAxis : [
                                    {
                                        type : 'category',
                                        boundaryGap : false,
                                        axisLabel:{
                                            color: fontColor
                                        },
                                        axisLine:{
                                            show:true,
                                            lineStyle:{
                                                color:'#397cbc'
                                            }
                                        },
                                        axisTick:{
                                            show:false,
                                        },
                                        splitLine:{
                                            show:true,
                                            lineStyle:{
                                                color:'#195384'
                                            }
                                        },
                                        /*data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],*/
                                        data:['2015','2016','2017','2018'],
                                        textStyle:{
                                            color:'#0f5ab5'
                                        }
                                    }
                                ],
                                yAxis : [
                                    {
                                        type : 'value',
                                        name : '产量',
                                        /*min:0,*/
                                        /*max:1000,*/
                                        /*max:50,*/
                                        axisLabel : {
                                            formatter: '{value}',
                                            textStyle:{
                                                color:'#0f5ab5'
                                            }
                                        },
                                        axisLine:{
                                            lineStyle:{
                                                color:'#27b4c2'
                                            }
                                        },
                                        axisTick:{
                                            show:false,
                                        },
                                        splitLine:{
                                            show:true,
                                            lineStyle:{
                                                color:'#11366e'
                                            }
                                        }
                                    },

                                ],
                                series : [
                                    {
                                        name:'马铃薯',
                                        type:'line',
                                        // stack: '总量',
                                        symbol:'circle',
                                        symbolSize: 8,
                                        itemStyle: {
                                            normal: {
                                                color:'#0092f6',
                                                lineStyle: {
                                                    color: "#0092f6",
                                                    width:1
                                                },
                                                areaStyle: {
                                                    //color: '#94C9EC'
                                                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                                        offset: 0,
                                                        color: 'rgba(7,44,90,0.3)'
                                                    }, {
                                                        offset: 1,
                                                        color: 'rgba(0,146,246,0.9)'
                                                    }]),
                                                }
                                            }
                                        },
                                        markPoint:{
                                            itemStyle:{
                                                normal:{
                                                    color:'red'
                                                }
                                            }
                                        },
                                        /*data:[120, 132, 101, 134, 90, 230, 210, 182, 191, 234, 290, 330]*/
                                        data:[]
                                    },
                                    {
                                        name:'大豆',
                                        type:'line',
                                        // stack: '总量',
                                        symbol:'circle',
                                        symbolSize: 8,

                                        itemStyle: {
                                            normal: {
                                                color:'#00d4c7',
                                                lineStyle: {
                                                    color: "#00d4c7",
                                                    width:1
                                                },
                                                areaStyle: {
                                                    //color: '#94C9EC'
                                                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                                        offset: 0,
                                                        color: 'rgba(7,44,90,0.3)'
                                                    }, {
                                                        offset: 1,
                                                        color: 'rgba(0,212,199,0.9)'
                                                    }]),
                                                }
                                            }
                                        },
                                        /*data:[220, 182, 191, 234, 290, 330, 310,201, 154, 190, 330, 410]*/
                                        data:[]
                                    },
                                    {
                                        name:'玉米',
                                        type:'line',
                                        /*stack: '总量',*/
                                        symbol:'circle',
                                        symbolSize: 8,
                                        itemStyle: {
                                            normal: {
                                                color: '#aecb56',
                                                lineStyle: {
                                                    color: "#aecb56",
                                                    width:1
                                                },
                                                areaStyle: {
                                                    //color: '#94C9EC'
                                                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                                        offset: 0,
                                                        color: 'rgba(7,44,90,0.3)'
                                                    }, {
                                                        offset: 1,
                                                        color: 'rgba(114,144,89,0.9)'
                                                    }]),
                                                }
                                            }
                                        },
                                        /*data:[150, 232, 201, 154, 190, 330, 410,150, 232, 201, 154, 190]*/
                                        data:[]
                                    },
                                    {
                                        name:'水稻',
                                        type:'line',
                                        /*stack: '总量',*/
                                        symbol:'circle',
                                        symbolSize: 8,
                                        itemStyle: {
                                            normal: {
                                                color: '#fd24fd',
                                                lineStyle: {
                                                    color: "#fd24fd",
                                                    width:1
                                                },
                                                areaStyle: {
                                                    //color: '#94C9EC'
                                                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                                        offset: 0,
                                                        color: 'rgba(7,44,90,0.3)'
                                                    }, {
                                                        offset: 1,
                                                        color: 'rgba(114,144,89,0.9)'
                                                    }]),
                                                }
                                            }
                                        },
                                        /*data:[150, 232, 201, 154, 190, 330, 410,150, 232, 201, 154, 190]*/
                                        data:[]
                                    }
                                ]
                            };
                            $.each(jsonarray,function (index,item) {
                                if(item.type == "马铃薯"){
                                    option.series[0].data.push(item.value);
                                }else if (item.type == "大豆") {
                                    option.series[1].data.push(item.value);
                                } else if (item.type == "玉米") {
                                    option.series[2].data.push(item.value);
                                } else {
                                    option.series[3].data.push(item.value);
                                }
                            });

                            myChart4.setOption(option);
                                    }

                                });
                            });

                            window.onresize = function(){

                                myChart1.resize();
                                myChart2.resize();
                                myChart3.resize();
                                myChart4.resize();
                                myChart8.resize();


                            }
                        </script>
                    </div>
                </div>
<!--                <div class="down">-->
<!--                    <h5>黑龙江总种植面积,同比增幅</h5>-->
<!--                    <strong>1234<span>万</span></strong><p><i>+</i> 20%</p>-->
<!--                </div>-->
            </div>
        </div>
    </div>

    <!--end右侧4块-->
</div>
<!--nav-->
<!--<div class="container">-->
<!--    <section>-->
<!--        <button  onclick="shouye()"  class="btn btn-green btn-border-o active">首页</button>-->
<!--        <button onclick="nydsj()" class="btn btn-blue btn-border-o">数据检测</button>-->
<!--        <button onclick="zlzs()" class="btn btn-purple btn-border-o">质量追溯</button>-->
<!--        <button onclick="zjzd()" class="btn btn-red  btn-border-o">专家指导</button>-->
<!--        <button onclick="nybk()" class="btn btn-orange btn-border-o">农业百科</button>-->
<!--    </section>-->
<!--</div>-->

<script type="text/javascript">

    $(".title").css("line-height",$(".title").height() + 'px')
    $(window).resize(function(){
        $(".title").css("line-height",$(".title").height() + 'px')
    })
    var locale="";
    window.onload = function(){
        var req = new XMLHttpRequest();
        req.open('GET', document.location, false);
        req.send(null);
        var headers = req.getAllResponseHeaders();
        locale=req.getResponseHeader('content-language');
        if(locale=="en-US"){
            locale="en_US";
        }else{
            locale="zh_CN";
        }
    }

    function zlzs(){
        window.location.href="${request.contextPath}/sy/zlzs/zlzsnew.html?locale="+locale;
    }
    function shouye(){
        window.location.href="${request.contextPath}/sy/index/indexnew.html?locale="+locale;
    }
    function zjzd(){
        window.location.href="${request.contextPath}/sy/zjwd/zjwdnew.html?locale="+locale;
    }
    function nybk(){
        window.location.href="${request.contextPath}/sy/nybk/nybknew.html?locale="+locale;
    }
    /*function nydsj(){
        window.location.href="${request.contextPath}/sy/nydsj/nydsjnew.html?locale="+locale;
    }*/
    function nydsj(address) {
        location.href = '${request.contextPath}/sy/nydsj/nydsjnew.html?address='+address+"&locale="+locale;
    }
</script>


</body>
</html>
